<template>
  <div class="Modularinformation">
    <div class="pubBig Privilege">
      <div class="h0">
        <p class="lt"></p>
      </div>
      <div class="m0">
        <div class="form-group">
          <fieldset>
            <legend>查询条件</legend>
            <div>
              <p>
                <label>简码：</label>
                <input
                  v-model="model_jm"
                  type="text"
                  class="form-control"
                  placeholder="请输入模块编号/模块名称"
                  style="width: 300px"
                />
              </p>
              <p>
                <button
                  class="btn btn-default"
                  @click="queryz()"
                >查询</button>
              </p>
            </div>
          </fieldset>
        </div>
      </div>
      <div class="btnLine">
        <button
          class="btn btn-default"
          @click="addMasterUser()"
        >新增</button>
        <button
          class="btn btn-default"
          @click="savez()"
          id="3"
        >保存</button>
        <button
          class="btn btn-default"
          @click="deletez()"
        >删除</button>
        <button class="btn btn-default">审核</button>
        <button class="btn btn-default">打印</button>
        <label class="mark1"><input type="checkbox" />显示</label>
      </div>
      <div class="dUpMain">
        <div class="oneBox clearfix">
          <p class="p1">新增内容</p>
        </div>
        <div class="threeBox pucLab clearfix">
          <p><label>角色编号:</label><input
              class="form-control"
              v-model="model_id"
              placeholder="请输入"
              type="text"
              @keyup.enter="submit1()"
              id="1"
              readonly
            />
          </p>
          <p><label>模块名称:</label><input
              class="form-control"
              v-model="model_name"
              placeholder="请输入"
              type="text"
              @keyup.enter="submit1()"
              id="2"
            />
          </p>
          <p><label>路径URL:</label><input
              class="form-control"
              v-model="model_name"
              placeholder="请输入"
              type="text"
              @keyup.enter="submit1()"
              id="31"
            />
          </p>

        </div>
      </div>
      <div class="dDownMain">
        <p class="p1">查询明细</p>
        <div
          class="twoBox"
          style="top: 295px"
        >
          <table class="table table-bordered">
            <thead>
              <tr>
                <th>模块编号</th>
                <th>模块名称</th>
              </tr>
            </thead>
            <tbody>
              <tr
                v-for="(item,index) in model_query"
                :key="index"
                @click="openDetails(item,index)"
                :class="{selGreen:changeSelectStyle == index}"
              >
                <td>{{item.id}}</td>
                <td>{{item.name}}</td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "Modularinformation",
  data () {
    return {
      msg: "SystemManagement 下的 Modularinformation",
      model_jm: "",
      //
      model_id: "",
      model_name: "",
      model_Url: "",
      //
      model_XZBJ: "",
      model_query_BC: [],
      model_query: [], //查询结果
      changeSelectStyle: "",
      model: {
        columns: [
          { field: "id", title: "模块编号" },
          { field: "name", title: "模块名称" }
        ],
        data: []
      },
      currentPage: 1,
      total: 0,
      pagesize: 13
    };
  },
  methods: {
    openDetails (row, index) {
      this.model_id = row.id;
      this.model_name = row.name;
      this.changeSelectStyle = index;
      if (this.model_XZBJ == "1") {
        this.model_jm = row.id;
        this.queryz();
        this.changeSelectStyle = "0";
        this.model_jm = "";
      }

      console.log(row);
    },
    handleChange (val) {
      console.log(val);
    },
    //主表保存
    savez () {
      if (this.model_name == "") {
        this.$message({ showClose: true, message: "模块名称不能为空！", type: "error" });
        return;
      }
      var data = {
        model: "11.综合维护-模块信息",
        code: "11041",
        input: {
          "id": this.model_id == "" ? "1" : this.model_id,
          "name": this.model_name
        }
      };
      this.$post("CloudHIS/Business_Handle", data)
        .then(res => {
          if (res.code == 0) {
            this.model_XZBJ = "1"
            this.$message({ message: res.msg, type: "success" });
            this.queryz();
            this.addMasterUser();
            document.getElementById("2").focus();
          } else {
            this.$message({ showClose: true, message: res.msg, type: "error" });
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //删除主表信息
    deletez () {
      var data = {
        model: "11.综合维护-模块信息",
        code: "11043",
        input: {
          "id": this.model_id
        }
      };
      this.$post("CloudHIS/Business_Handle", data)
        .then(res => {
          if (res.code == 0) {
            this.$message({ message: res.msg, type: "success" });
            this.queryz();
            this.addMasterUser();
          } else {
            this.$message({ showClose: true, message: res.msg, type: "error" });
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //主表查询

    queryz () {
      this.model_query = [];
      var data = {
        model: "11.综合维护-模块信息",
        code: "11042",
        input: {
          jm: this.model_jm ? this.model_jm : ""
        }
      };
      console.log(data)
      this.$post("CloudHIS/Business_Handle", data)
        .then(res => {
          if (this.model_XZBJ == "1") {
            this.model_query.push(res.data[res.data.length - 1]); this.model_XZBJ = "";
            this.changeSelectStyle = "0";
          } else {
            this.model_query = res.data;
            this.addMasterUser();
          }
          console.log("查询结果");
          console.log(res);
        })
        .catch(err => {
          console.log(err);
        });
    },
    submit1 () {
      var ele = window.event.srcElement;
      var idcount = parseInt(ele.id) + 1;

      document.getElementById(idcount + "").focus();
    },
    addMasterUser () {
      this.model_id = "";
      this.model_name = "";
      document.getElementById("1").focus();
    },
    submit (item, index) {
      this.index = index;
      console.log(item);
      var arr = window.document.getElementsByTagName("input");
      for (var i = 0; i < arr.length; i++) {
        var t = arr[i];
        t.index = i;
        t.onkeydown = function (event) {
          if (event.keyCode == 13) {
            var next = this.index + 1;
            arr[next].focus();
          }
        };
      }
    },
    palction () {
      console.log(this.model.data);
    },
    current_change (currentPage) {
      this.currentPage = currentPage;
      this.queryz();
    }
  },
  mounted () {
    document.getElementById("2").focus();
  },
  created () {
    if (this.$route.query.Token) {
      localStorage.setItem('Token', this.$route.query.Token)
    }
    this.queryz();
  }
};
</script>

<style lang="scss">
.Modularinformation {
}
</style>
